<template>
<el-col :span="24" class="paging">

    <el-pagination background layout="total,prev, pager, next" :page-size='pageSize' :total="total" :current-page="pageIndex" @current-change="currentChange" style="text-align:center;">
    </el-pagination>
</el-col>
</template>

<script>
export default {
    name: "Paging",
    data() {
        return {
            pageIndex: 1,
            pageSize: 10,

        }

    },
    props: {

        total: {
            type: Number,
            default: 0,
        },

    },
    methods: {
        currentChange: function (row) {
            debugger;
            this.pageIndex = row;
            this.$emit('currentChange', row);
        }
    },
    created() {
        // this.pageIndex = 1;
    },

}
</script>

<style scoped>
.paging {
    position: relative;
    box-shadow: 0 5px 10px #ddd;
    background: #fff;
    border: 1px solid #f0f0f0;
}
</style>
